<template>
	<view class="goodClassBOX">
		<shopTrick v-show="showTop"></shopTrick>
		<view  :class="'search_tab '+(!showTop?'search_tabfixed':'')" @click="goSearch">
			 <view class="top_search" style="width: 100%;">
				 <label style="width: 100%;">搜索店铺内商品</label>
			 </view> 
		</view>
		<view class="goodsClass " v-for="item in goodsClassList" :key='item.sort_id' >
			<view class="goodsClass_til" @click="goGoods(item.sort_id,item.level)">
				{{ item.sort_name }}
			</view>
			<view class="goodsClassList" v-if="item.son_list.length >0 ">
				<view v-for="jtem in item.son_list" class="goodsClassListBlock" @click="goGoods(jtem.sort_id,jtem.level)">{{ jtem.sort_name }}</view>
			</view>
		</view> 
		 
		<tabbar :tranfState = 'tranfState' ></tabbar>
	</view>
</template>

<script>
	import tabbar from '../components/tabbar/tabbar' 
	import shopTrick from '../components/shopTrick/shopTrick'
	var common = require('../../../utils/common.js');
	var mall_common = require('../../mall/js/common.js');
	var shop_common = require('../../../utils/shop/common.js');
	const { windowWidth, windowHeight } = uni.getSystemInfoSync();
	var app = getApp();
	var store_id
	export default{
		data(){
			return{
				goodsClassList:[],
				showTop:true,
				topFixed:false,
				tranfState:'goodsClass' 
			}
		},
		components:{
			tabbar,
			shopTrick
		},
		onLoad(option){  
			store_id = option.store_id
			var that = this 
			// mall_common.initData(store_id);
			// shop_common.getStorage('store_id').then(data=>{
			//  	console.log(data)
			//  	if(store_id!=data){
			//  		shop_common.setStorage('store_id',store_id)  
			//  	}else{
			//  	    store_id = data
			//  	}
				
				
			//  }) 
			
			var Param={
				store_id:store_id 
			} 
			common.post('Mall&a=get_sorts_list',Param, data => {
				console.log(data) 
				that.goodsClassList = data
			})
			
		},
		methods:{
			goGoods(sort_id,level){ 
				window.location.href = 'goods?store_id='+store_id+'&sort_id='+sort_id+'&sort_level='+level+'&type=goodsClass'
				// uni.redirectTo({
				//     url: 'goods?store_id='+store_id+'&sort_id='+sort_id+'&sort_level='+level+'&type=goodsClass'
				// });
			},
			onPageScroll:function(e){
				console.log('onPageScroll allgoods')
				if(e.scrollTop >10){
					this.showTop = false
					this.topFixed = true
				}else{
					this.showTop = true
					this.topFixed = false
				} 
			},
			goSearch(){
				mall_common.goSearch(store_id)
			}
		}
	}
</script>

<style>
	@import url("../css/mall.css");
	.goodsClass{
		margin: 10px;
		background: #fff;
		padding: 10px;
		border-radius: 10px ;
		
	}
	.goodsClass .goodsClass_til{
		font-size: 15px;
		color: #666;
		background: url(../../../static/mall/rg_icon.png) right  center no-repeat; 
		background-size: 20px auto;
		line-height: 40px;
		font-weight: bold;
		overflow: hidden;/*超出部分隐藏*/
		white-space: nowrap;
		text-overflow:ellipsis; 
		padding-right: 50px;
	}
	.goodsClassList{
		padding: 10px 0; 
	}
	.goodsClassList .goodsClassListBlock{
		width: 49%;
		display: inline-block;
		overflow: hidden;/*超出部分隐藏*/
		white-space: nowrap;
		text-overflow:ellipsis; 
		background: #f2f2f2;
		font-size: 13px;
		line-height: 34px;
		padding: 0 10px;
		box-sizing: border-box;
		color: #666;
		margin-bottom: 5px;
	}
	.goodsClassList .goodsClassListBlock:nth-child(2n){
		margin-left: 2%;
	}
	
	.search_tab{
		width: auto;
		right: 10px;
		top:0;
		margin-top: 78px;
	}
	.search_tabfixed{
		top:0;
	    padding: 10px;
		width: 100%;
		margin-top: 0;
		box-sizing: border-box;
	} 
	.goodClassBOX{
		padding-bottom: 60px;
	}
</style>
